<template>
  <div class="QAManageUserInfo">
    <el-dropdown>
      <el-button size="small" class="userinfoMaBtn">{{ nickname }}</el-button>
      <template #dropdown>
        <el-dropdown-menu>
          <el-dropdown-item @click="logoutBtn">退出登录</el-dropdown-item>
        </el-dropdown-menu>
<!--        <el-dropdown-menu>-->
<!--          <el-dropdown-item @click="profileBtn">个人中心</el-dropdown-item>-->
<!--        </el-dropdown-menu>-->
      </template>
    </el-dropdown>
  </div>
</template>

<script>
export default {
  name: "QAManageUserInfoItem",
  props: ['username', 'nickname'],
  methods: {
    logoutBtn(){
      localStorage.clear()
      console.log('clear localS');
      const { href } = this.$router.resolve({
        path: '/',
      });
      window.open(href,'_self')

    },
    profileBtn() {
      const { href } = this.$router.resolve({
        path: '/info',
      });
      window.open(href,'_self')

    }
  }
}
</script>

<style scoped>
  .QAManageUserInfo {
    float: right;
    margin-right: 30px;
  }
  .userinfoMaBtn {
    font-size: 8px;
    color: white;
    background-color: #3e99f5;
  }
</style>